<template>
  <div class="enum_chb-wrapper field">
    <label :class="{must: field.is_must}">{{field.title}}</label>
    <div class="ui inline fields" v-for="line in enum_val_lines">
      <div class="field" v-for="(val,index) in line">
      <input type="checkbox"  :value="val.id" v-model="selecteds"> <div class="ui label">{{val.title}}</div>
      </div>
    </div>
  </div>
</template>

<script>
  import tool from 'src/util/tool';
  import util from '_util/index';
  import logic from '_logic';
  import _ from 'lodash';


  export default {
    data() {
      return {
        selecteds: [],
        enum_val: null,
      }
    },
    methods: {

    },
    watch: {
      selecteds: function(val, old) {
        this.$emit('setVo', this.field.name, val.join('|'))
      },
    },
    components: {
    },
    computed: {
      enum_val_lines(){
        return _.chunk(this.enum_val, 7);
      }
    },
    props: ['field'],
    created() {

      logic.edit.set_enum_val(this,1)

      if(this.field.fval){
        let arr = this.field.fval.split('|');
        this.selecteds=arr

      }
    },
    mounted() {
    }
  };
</script>

<style rel="stylesheet/less" lang="less" scoped>
  @import "../../../common/style/mixin";
  @dir: "field/";
  .enum_chb-wrapper{
    .ui.inline.fields{
      .ui.label{
        margin-left:-5px;
        margin-right:10px;
      }
    }
    .sortMenu();
    .messageIcon();
  }

</style>
